<template>
    <view class="page-box">
        <view class="logo row verCenter">
            <image src="../../static/logo.png" mode="aspectFill"></image>
        </view>
        <header class="header">
            <view class="search row bothSide verCenter">
                <input type="text" placeholder="搜索产品名称/关键字" class="uni-input" placeholder-style="color:#6E767A" @input="handleInput" />
                <text class="iconfont icon-a-tubiaochangyongsousuo"></text>
            </view>
            <view class="slide">
                <image src="../../static/banner.jpg" mode="aspectFill"></image>
            </view>
        </header>
        <nav class="nav">
            <navigator class="box column rowCenter verCenter" url="/pages/productMatch/systemAutomaticMatching" hover-class="none">
                <image src="../../static/icon-1.png" mode="aspectFill"></image>
                <text class="text">产品匹配</text>
            </navigator>
            <view class="box column rowCenter verCenter">
                <image src="../../static/icon-2.png" mode="aspectFill"></image>
                <text class="text">车辆评估</text>
            </view>
            <view class="box column rowCenter verCenter" hover-class="none" @click="selectProduct()">
                <image src="../../static/icon-3.png" mode="aspectFill"></image>
                <text class="text">进件管理</text>
            </view>
            <a class="box column rowCenter verCenter" href="https://ers.everyoneisceo.com/saas-loan-calc/#/" hover-class="none">
                <image src="../../static/icon-4.png" mode="aspectFill"></image>
                <text class="text">贷款计算器</text>
            </a>
            <navigator class="box column rowCenter verCenter" url="/pages/index/creditInquiry?req_type=3" hover-class="nones">
                <image src="../../static/icon-5.png" mode="aspectFill"></image>
                <text class="text">征信授权</text>
            </navigator>
            <navigator class="box column rowCenter verCenter" url="/pages/index/creditInquiry?req_type=2" hover-class="nones">
                <image src="../../static/icon-6.png" mode="aspectFill"></image>
                <text class="text">人法查询</text>
            </navigator>
            <navigator class="box column rowCenter verCenter" url="/pages/index/creditInquiry?req_type=1" hover-class="nones">
                <image src="../../static/icon-7.png" mode="aspectFill"></image>
                <text class="text">用户画像</text>
            </navigator>
            <navigator class="box column rowCenter verCenter" url="/pages/index/news">
                <image src="../../static/icon-8.png" mode="aspectFill"></image>
                <text class="text">知识星球</text>
            </navigator>
        </nav>
        <article class="article">
            <view class="title">平台数据</view>
            <view class="platform-data">
                <view class="row box bothSide verCenter">
                    <text class="t1">平台伙伴</text>
                    <view class="row verCenter">
                        <text class="t2">{{platformData.platform_partner}}</text>
                        <text class="t3">人</text>
                    </view>
                </view>
                <view class="row box bothSide verCenter">
                    <text class="t1">伙伴收入</text>
                    <view class="row verCenter">
                        <text class="t2">{{platformData.partner_income }}</text>
                        <text class="t3">万</text>
                    </view>
                </view>
                <view class="row box bothSide verCenter">
                    <text class="t1">服务客户</text>
                    <view class="row verCenter">
                        <text class="t2">{{platformData.serve_clients }}</text>
                        <text class="t3">人</text>
                    </view>
                </view>
                <view class="row box bothSide verCenter">
                    <text class="t1">促成金额</text>
                    <view class="row verCenter">
                        <text class="t2">{{platformData.contributory_amount }}</text>
                        <text class="t3">亿</text>
                    </view>
                </view>
            </view>
        </article>
        <article class="article">
            <view class="title">行业资讯</view>
            <view class="knowledge-planet">
                <a class="column box" v-for="(item,index) in articlesAndCounselor.articles" :key="index" :href="item.url">
                    <view class="article-title">{{item.title}}</view>
                    <view class="article-content">{{item.describe}}</view>
                </a>
            </view>
        </article>
        <article class="article">
            <view class="title">明星大咖</view>
            <view class="celebrity-big-shot">
                <navigator class="column rowCenter verCenter box" v-for="(item,index) in articlesAndCounselor.counselors" :key="index" :url="'/pages/productMatch/chat?id='+item.id" hover-class="none">
                    <view class="pic">
                        <image :src="item.photo" mode="aspectFill"></image>
                    </view>
                    <text class="t1">{{item.name}}</text>
                    <text class="t2">明星顾问</text>
                </navigator>
            </view>
        </article>
        <!--产品选中-->
        <uni-popup ref="popup" background-color="#ffffff" border-radius="20rpx">
            <view class="popup-content">
                <view class="select-product column">
                    <text class="title">请选择产品类型</text>
                    <view class="box row rowCenter verCenter" @click="toUrl(1)">自主产品</view>
                    <view class="box row rowCenter verCenter" @click="toUrl(2)">非自主产品</view>
                    <view class="box row rowCenter verCenter" @click="toUrl(3)">自营产品</view>
                </view>
            </view>
        </uni-popup>
    </view>
</template>

<script>
    import { API } from '@/util/api.js';
    import debounce from 'lodash/debounce';

    export default {
        data() {
            return {
                platformData: {}, //平台数据
                articlesAndCounselor: {} //首页文章和顾问
            };
        },
        onLoad() {

        },
        onShow() {
            this.getData();
        },
        methods: {
            getData() {
                this.request(API.platformData, 'GET', {}, false).then(res => {
                    if (res.code === 0) {
                        this.platformData = res.data;
                    } else {
                        uni.showToast({
                            title: res.msg,
                            icon: 'none'
                        });
                    }
                });
                this.request(API.articlesAndCounselor, 'GET', {}, false).then(res => {
                    if (res.code === 0) {
                        this.articlesAndCounselor = res.data;
                        this.articlesAndCounselor.counselors = this.articlesAndCounselor.counselors.slice(0, 3);
                    } else {
                        uni.showToast({
                            title: res.msg,
                            icon: 'none'
                        });
                    }
                });
            },
            handleInput: debounce(function() {
                uni.switchTab({
                    url: '/pages/product/index'
                })
            }, 500),
            /**
             * 选择产品
             */
            selectProduct() {
                this.$refs.popup.open('center');
            },
            /**
             * @param {Object} type 1自主产品 2非自主产品
             */
            toUrl(type) {
                this.$refs.popup.close();
                if (type == 1) {
                    uni.navigateTo({
                        url: '/pages/order/index'
                    })
                } else if (type == 2) {
                    uni.navigateTo({
                        url: '/pages/order/yx?product_api=2'
                    })
                } else if (type == 3) {
                    uni.navigateTo({
                        url: '/pages/order/index?product_api=1'
                    })
                }
            }
        }
    };
</script>

<style scoped lang="scss">
    @import '@/assets/css/index/index.scss';
</style>